Open
Conversation
Co-authored-by: nstepien
|
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #3969 +/- ##
==========================================
+ Coverage 97.53% 97.55% +0.01%
==========================================
Files 36 36
Lines 1463 1473 +10
Branches 472 481 +9
==========================================
+ Hits 1427 1437 +10
Misses 36 36
🚀 New features to boost your workflow:
|
nstepien
commented
Feb 27, 2026
| transition: opacity 0.1s; | ||
|
|
||
| /* TODO: reverse 'opacity' and remove 'not' */ | ||
| @container rdg-root not scroll-state(scrollable: inline-start) { |
Collaborator
Author
There was a problem hiding this comment.
Firefox/Safari will always show the shadow until they support scroll-state container queries.
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Properties/container-type
Comment on lines
+97
to
+102
| width: 10px; | ||
| background-image: linear-gradient( | ||
| to right, | ||
| light-dark(rgb(0 0 0 / 15%), rgb(0 0 0 / 40%)), | ||
| transparent | ||
| ); |
Collaborator
Author
There was a problem hiding this comment.
The shadow is wider/stronger than before, let me know if you think we should tweak it.
| )} | ||
| </DataGridDefaultRenderersContext> | ||
|
|
||
| {lastFrozenColumnIndex > -1 && ( |
Collaborator
Author
There was a problem hiding this comment.
This is the best way I found to make it work in all scenarios, including column grouping.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Before
Borders would increase the layer size (in devtools: "show layer borders"), and bleed onto other rows. They'd also be slightly round, instead of being uniform vertically.
box-shadowmay also impact browser rendering performance, haven't checked though.I've maxed out the shadow's color opacity in the second screenshot so it's easier to tell.
After
No overlapping layers, uniform shadows, and thanks to container queries: no shadow if we're at
scrollable: inline-start👍I've also tweaked the shadow so it looks more like a shadow than before.